<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>节点集合</title>
</head>
<body>
    <div desc="后盾人">houdunren</div>
    <div desc="开源系统">hdcms</div>
</body>
</html>

<script>
    //map的key可以为任意的类型,下面使用DOM节点作为键来记录数据
    const divMap = new Map();
    const divs = document.querySelectorAll('div');
    divs.forEach(div => {
        divMap.set(div,{
            content:div.getAttribute('desc')
        });
    });

    //点击当前元素的时候，获取当前元素的属性信息
    divMap.forEach((consfig,elem) => {
        elem.addEventListener("click",function(){
            let _html = elem.innerHTML;
            elem.innerHTML = '';
            elem.innerHTML = `${_html} - ${divMap.get(this).content}`;
        });
    });
    //
</script>